<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>权限分配</title>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/zui.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/zui-theme.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/app.css">
    <script type="text/javascript">
    var base_url = "{:url('/')}";
    </script>
</head>

<body>
    <form method="post" class="form-horizontal p5">
        <ul class="nav nav-tabs nav-primary">
            {volist name="tree" id="site" key="i"}
            <li class="{$i==1?'active':''}"><a data-tab href="#tabContent{$i}">{$site['site_name']}</a></li>
            {/volist}
        </ul>
        <div class="tab-content">
            {volist name="tree" id="site" key="i"}
            <div class="tab-pane {$i==1?'active':''}" id="tabContent{$i}">
                <div class="pt5 pb5">
                    <a class="btn check-all pr10" data-id="tree_{$site['site_mark']}">全选</a>
                    <a class="btn nocheck-all" data-id="tree_{$site['site_mark']}">取消</a>
                </div>
                <div class="panel" style="height: 300px; overflow-y: auto;">
                    <div id="tree_{$site['site_mark']}" class="ztree"></div>
                </div>
            </div>
            {/volist}
        </div>
        <div class="pr5 pl5 pt10 pb10 text-right navbar-fixed-bottom bg-white">
            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            <button type="button" id="group-action" class="btn btn-primary">保存</button>
        </div>
    </form>
    <script src="__STATIC__/lib/jquery/jquery.js"></script>
    <script src="__STATIC__/lib/jquery/jquery.ztree.all.min.js"></script>
    <script src="__STATIC__/js/zui.min.js"></script>
    <script src="__STATIC__/js/app.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {

        var setting = {
            view: { selectedMulti: false },
            check: { enable: true },
            data: { simpleData: { enable: true } }
        };

        /** {volist name="tree" id="site"} **/
        var site_{$site['site_mark']} = {:json_encode($site['site_menu'])};
        $.fn.zTree.init($("#tree_{$site['site_mark']}"), setting, site_{$site['site_mark']});
        /** {/volist} **/

        $("#group-action").click(function(event) {
            var data = new Array();
            var treeObj, nodes;
            var trees = $("div[id^='tree_']");
            trees.each(function(index, el) {
                treeObj = $.fn.zTree.getZTreeObj($(el).attr('id'));
                nodes = treeObj.getCheckedNodes(true);
                $.each(nodes, function(i, item) {
                    data.push(item.path);
                });
            });

            sxj.ajax_post(
                "{:url('/manage/group_action_save')}", { id: {$group['group_id']}, action: data }
            );
            return false;
        });

        $(".check-all").click(function(event) {
            var id = $(this).data('id');
            var treeObj = $.fn.zTree.getZTreeObj(id);
            treeObj.checkAllNodes(true);
        });

        $(".nocheck-all").click(function(event) {
            var id = $(this).data('id');
            var treeObj = $.fn.zTree.getZTreeObj(id);
            treeObj.checkAllNodes(false);
        });

        $('[data-dismiss="modal"]').click(function(event) {
            window.parent.$(".modal").modal("hide");
        });
    });
    </script>
</body>

</html>